<!--
Copyright (C) 2020 Yoann QUERET <yoann@queret.net>
-->

<!--
This file is part of ODR-EncoderManager.

ODR-EncoderManager is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

ODR-EncoderManager is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with ODR-EncoderManager.  If not, see <http://www.gnu.org/licenses/>.
-->


<!DOCTYPE html>
<html lang="en">

{% include 'head.html' %}

<body>
        {% include 'body-nav.html' %}

        <div class="container-fluid">

                <div class="page-header">
                        <h1>Manage encoder</h1>
                </div>

                <!-- Modal Info -->
                <div class="modal fade" id="InfoModal" role="dialog">
                <div class="modal-dialog modal-lg">
                <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Loading ...</h4>
                </div>
                <div class="modal-body">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
                </div>
                </div>
                </div>

                <!-- Modal AES67 wizard -->
                <div class="modal fade" id="AES67WizardModal" role="dialog">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">AES67 SDP file wizard</h4>
                            </div>
                            <div class="modal-body">

                                <ul class="nav nav-tabs">
                                    <li class="active"><a data-toggle="tab" href="#wizard_aes67">AES67 (Livewire, Axia, Ravenna)</a></li>
                                    <li><a data-toggle="tab" href="#wizard_dante">Dante</a></li>
                                </ul>

                                <div class="tab-content">
                                    <div id="wizard_aes67" class="tab-pane fade in active">
                                        <h4>AES67 SDP Generator</h4>
                                        <div class="panel-body">
                                            <div class="form-group">
                                                <div class="col-sm-7">
                                                    <div class="form-group">
                                                        <label class="control-label" for="wizard_aes67_srcnodeip">Source node IP address:</label>
                                                        <input type="text" class="form-control" id="wizard_aes67_srcnodeip" placeholder="Enter source node IP address" value="172.16.235.155">
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="control-label" for="wizard_aes67_channel">Livewire channel number:</label>
                                                        <input type="text" class="form-control" id="wizard_aes67_channel" placeholder="Enter livewire channel [1-32767]" value="1">
                                                    </div>
                                                    <button type="button" class="btn btn-info" id="btn_wizard_aes67_copy">Copy SDP preview to SDP content</button>
                                                </div>
                                                <div class="col-sm-5">
                                                    <div class="form-group">
                                                        <label class="control-label" for="wizard_aes67_sdp">SDP preview:</label>
                                                        <textarea class="form-control" rows="8" cols="80" id="wizard_aes67_sdp"></textarea>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div id="wizard_dante" class="tab-pane fade">
                                        <p>To use a Dante source, you need to use a Dante AVIO USB IO Adapter 2x2 and alsa input type</p>
                                    </div>
                                </div>

                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Modal AVT SNMP Get status -->
                <div class="modal fade" id="AVTViewModal" role="dialog">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">AVT SNMP Get status</h4>
                            </div>
                            <div class="modal-body">

                                <ul class="nav nav-tabs">
                                    <li class="active"><a data-toggle="tab" href="#AVTViewGlobal">Global</a></li>
                                    <li><a data-toggle="tab" href="#AVTViewEncoder">Encoder</a></li>
                                    <li><a data-toggle="tab" href="#AVTViewAlarms">Alarms</a></li>
                                </ul>

                                <div class="tab-content">
                                    <div id="AVTViewGlobal" class="tab-pane fade in active">
                                        <div class="table-responsive">
                                            <table id="AVTViewTableGlobal" class="table table-hover">
                                                <thead>
                                                    <tr>
                                                        <th class="hidden">Key</th>
                                                        <th class="col-md-4">Description</th>
                                                        <th class="col-md-4">Value</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                    <div id="AVTViewEncoder" class="tab-pane fade">
                                        <div class="table-responsive">
                                            <table id="AVTViewTableEncoder" class="table table-hover">
                                                <thead>
                                                    <tr>
                                                        <th class="hidden">Key</th>
                                                        <th class="col-md-4">Description</th>
                                                        <th class="col-md-2">Coder 1</th>
                                                        <th class="col-md-2">Coder 2</th>
                                                        <th class="col-md-2">Coder 3</th>
                                                        <th class="col-md-2">Coder 4</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                    <div id="AVTViewAlarms" class="tab-pane fade">
                                        <div class="table-responsive">
                                            <table id="AVTViewTableAlarms" class="table table-hover">
                                                <thead>
                                                    <tr>
                                                        <th class="hidden">Key</th>
                                                        <th class="col-md-4">Name</th>
                                                        <th class="col-md-4">State</th>
                                                        <th class="col-md-4">Date</th>
                                                        <th class="col-md-4">Count</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="modal-footer">
                                <span class="col-md-8 text-left" id="AVTViewInfo"></span>
                                <button type="button" class="btn btn-info" id="btn_avt_view_refresh">Refresh</button>
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                
                {% if is_adcast is sameas true and is_slide_mgnt is sameas true%}
                <!-- Modal ADCastModal -->
                <div class="modal fade" id="ADCastModal" role="dialog">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">ADCast</h4>
                            </div>
                            <div class="modal-body">

                            
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                {% endif %}

                <!-- Long form -->
                <ul id="tab_coder" class="nav nav-tabs">
                </ul>

                <div class="tab-content">
                    <div id="manage" class="tab-pane fade in active">
                    </div>

                    <div id="coder" class="tab-pane fade">

                        <form class="form-horizontal" role="form">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <p id="coder_description"></p>

                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                            <h4 class="panel-title">
                                            <span class="glyphicon glyphicon-music"></span> <a data-toggle="collapse" data-parent="#accordion" href="#collapseSource">Source</a>
                                            </h4>
                                    </div>
                                    <div id="collapseSource" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="source_type">Input type:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <select type="select" class="form-control" id="source_type">
                                                            <option value="alsa">alsa</option>
                                                            <option value="stream">stream</option>
                                                            <option value="avt">avt</option>
                                                            <option value="aes67">aes67 (experimental)</option>
                                                        </select>
                                                        <span class="input-group-addon"><input type="checkbox" id="source_display" data-toggle="tooltip" data-placement="top" title="Display all parameters."></span>
                                                    </div>
                                                </div>
                                                <label class="control-label col-sm-2" for="source_driftcomp">Drift compensation:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="source_driftcomp">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for=""></label>
                                                <div class="col-sm-3"></div>
                                                <label class="control-label col-sm-2" for="source_silence_detect">Silence detect</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="source_silence_detect" data-toggle="tooltip" data-placement="top" title="Abort encoding after silence.">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for=""></label>
                                                <div class="col-sm-3"></div>
                                                <label class="control-label col-sm-2" for="source_silence_duration">Silence duration:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="source_silence_duration" placeholder="Enter silence duration" data-toggle="tooltip" data-placement="top" title="Duration to wait in seconds before restart encoding.">
                                                </div>
                                            </div>
                                            <hr />

                                            <div id="source_type_alsa" class="source_type">
                                                <h4>Source alsa</h4>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="source_alsa_device">Device:</label>
                                                    <div class="col-sm-3">
                                                        <div class="input-group">
                                                            <input type="text" class="form-control" id="source_alsa_device" placeholder="Enter audio device (ex: plughw:1,0)">
                                                            <span class="input-group-btn">
                                                                <button type="button" id="btn_list_alsa_devices" class="btn btn-info" data-toggle="modal" data-target="#InfoModal">List devices</button>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <hr />
                                            </div>

                                            <div id="source_type_stream" class="source_type">
                                                <h4>Source stream</h4>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="source_stream_url">Stream URL:</label>
                                                    <div class="col-sm-8">
                                                        <input type="text" class="form-control" id="source_stream_url" placeholder="Enter streaming url">
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="source_stream_writeicytext">Write ICY Text:</label>
                                                    <div class="col-sm-3">
                                                        <select type="select" class="form-control" id="source_stream_writeicytext" data-toggle="tooltip" data-placement="top" title="Write the ICY Text into DLS file">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="source_stream_lib">Player library:</label>
                                                    <div class="col-sm-3">
                                                        <select type="select" class="form-control" id="source_stream_lib" data-toggle="tooltip" data-placement="top" title="Choose the library used to listen the stream">
                                                        <option value="gst">GStreamer</option>
                                                        <option value="vlc">VLC</option>
                                                    </select>
                                                    </div>
                                                </div>
                                                <hr />
                                            </div>

                                            <div id="source_type_avt" class="source_type">
                                                <h4>Source avt</h4>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="source_avt_input_uri">input URI:</label>
                                                    <div class="col-sm-3">
                                                        <input type="text" class="form-control" id="source_avt_input_uri" placeholder="Enter Input URI. (udp://:32010)" data-toggle="tooltip" data-placement="top" title="Input URI. (Supported: 'udp://...')">
                                                    </div>
                                                    <label class="control-label col-sm-2" for="source_avt_pad_port">pad port:</label>
                                                    <div class="col-sm-3">
                                                        <input type="text" class="form-control" id="source_avt_pad_port" placeholder="Enter pad port" data-toggle="tooltip" data-placement="top" title="Port opened for PAD Frame requests (def=0 not opened)">
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="source_avt_control_uri">control URI:</label>
                                                    <div class="col-sm-3">
                                                        <input type="text" class="form-control" id="source_avt_control_uri" placeholder="Enter Control URI. (udp://192.168.128.111:9325)" data-toggle="tooltip" data-placement="top" title="Output control URI (Supported: 'udp://...')">
                                                    </div>
                                                    <label class="control-label col-sm-2" for="source_avt_jitter_size">jitter size:</label>
                                                    <div class="col-sm-3">
                                                        <input type="text" class="form-control" id="source_avt_jitter_size" placeholder="Enter jitter size" data-toggle="tooltip" data-placement="top" title="Jitter buffer size, in 24ms frames (def=40)">
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for=""></label>
                                                    <div class="col-sm-3">
                                                        <button type="button" id="btn_avt_view" class="btn btn-info" data-toggle="modal" data-target="#AVTViewModal"><span class="glyphicon glyphicon-eye-open"></span> AVT SNMP Get status</button>
                                                    </div>
                                                    <label class="control-label col-sm-2" for="source_avt_timeout">timeout:</label>
                                                    <div class="col-sm-3">
                                                        <input type="text" class="form-control" id="source_avt_timeout" placeholder="Enter timeout" data-toggle="tooltip" data-placement="top" title="Maximum frame waiting time, in milliseconds (def=2000)">
                                                    </div>
                                                </div>
                                                <hr />
                                            </div>

                                            <div id="source_type_aes67" class="source_type">
                                                <h4>AES67</h4>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="source_aes67_sdp">SDP content:</label>
                                                    <div class="col-sm-3">
                                                        <div class="input-group">
                                                            <textarea class="form-control" rows="10" cols="80" id="source_aes67_sdp" placeholder="Enter SDP configuration or use Wizard"></textarea>
                                                        </div>
                                                    </div>
                                                    <label class="control-label col-sm-2" for="source_aes67_sdp_file">SDP file:</label>
                                                    <div class="col-sm-3">
                                                        
                                                        <div class="input-group">
                                                            <input type="text" class="form-control" id="source_aes67_sdp_file" placeholder="Enter SDP file"><br />
                                                            <div class="input-group-btn">
                                                                <button class="btn btn-default" type="button" id="btn_reset_source_aes67_sdp_file" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                    <i class="glyphicon glyphicon-repeat"></i>
                                                                </button>
                                                            </div>
                                                        </div>
                                                        
                                                        <button type="button" id="btn_aes67_wizard" class="btn btn-info" data-toggle="modal" data-target="#AES67WizardModal"><span class="glyphicon glyphicon-flash"></span> AES67 SDP Wizard</button>
                                                    </div>
                                                </div>
                                                <hr />
                                            </div>

                                        </div>
                                    </div>
                                </div>

                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">
                                        <span class="glyphicon glyphicon-play"></span> <a data-toggle="collapse" data-parent="#accordion" href="#collapseOutput">Output</a>
                                        </h4>
                                    </div>
                                    <div id="collapseOutput" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="output_type">Output type:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <select type="select" class="form-control" id="output_type">
                                                            <option value="dabp">DAB+</option>
                                                            <option value="dab">DAB</option>
                                                        </select>
                                                        <span class="input-group-addon"><input type="checkbox" id="output_display" data-toggle="tooltip" data-placement="top" title="Display all parameters."></span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="output_bitrate">Bitrate:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="output_bitrate" placeholder="Enter bitrate (ex: 96)" data-toggle="tooltip" data-placement="top" title="The bitrate value needs to match with the multiplex configuration. Change it according to the multiplex configuration.">
                                                </div>
                                                <label class="control-label col-sm-2" for="output_samplerate">Samplerate:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="output_samplerate">
                                                        <option value="48000">48000</option>
                                                        <option value="32000">32000 (DAB+ only)</option>
                                                        <option value="24000">24000 (DAB only)</option>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="output_channels">Channels:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="output_channels">
                                                        <option value="2">2 - Stéréo</option>
                                                        <option value="1">1 - Mono</option>
                                                    </select>
                                                </div>
                                            </div>

                                            <hr />

                                            <div id="output_type_dabp" class="output_type">
                                                <h4>DAB+ specific configuration</h4>
                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="output_dabp_sbr">SBR:</label>
                                                    <div class="col-sm-3">
                                                        <select type="select" class="form-control" id="output_dabp_sbr" data-toggle="tooltip" data-placement="top" title="Enable SBR only on bitrate from 96 kbps.">
                                                            <option value="true">true</option>
                                                            <option value="false">false</option>
                                                        </select>
                                                    </div>

                                                    <label class="control-label col-sm-2" for="output_dabp_ps">PS:</label>
                                                    <div class="col-sm-3">
                                                        <select type="select" class="form-control" id="output_dabp_ps" data-toggle="tooltip" data-placement="top" title="Enable PS only on bitrates which are a multiple of 8kbps and under 56 kbps.">
                                                            <option value="true">true</option>
                                                            <option value="false">false</option>source_device
                                                        </select>
                                                    </div>
                                                </div>

                                                <div class="form-group">
                                                    <label class="control-label col-sm-2" for="output_dabp_afterburner">After Burner:</label>
                                                    <div class="col-sm-3">
                                                        <select type="select" class="form-control" id="output_dabp_afterburner">
                                                            <option value="true">true</option>
                                                            <option value="false">false</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <hr />
                                            </div>

                                            <div id="output_type_dab" class="output_type">
                                                <h4>DAB specific configuration</h4>
                                                    <div class="form-group">
                                                    <label class="control-label col-sm-2" for="output_dab_dabmode">Channel mode:</label>
                                                    <div class="col-sm-3">
                                                        <select type="select" class="form-control" id="output_dab_dabmode" data-toggle="tooltip" data-placement="top" title="Channel mode">
                                                            <option value="s">s - Stereo</option>
                                                            <option value="d">d - Dual-Channel</option>
                                                            <option value="j">j - Joint-Stereo (default)</option>
                                                            <option value="m">m - Mono</option>
                                                        </select>
                                                    </div>

                                                    <label class="control-label col-sm-2" for="output_dab_dabpsy">Psychoacoustic model:</label>
                                                    <div class="col-sm-3">
                                                        <select type="select" class="form-control" id="output_dab_dabpsy" data-toggle="tooltip" data-placement="top" title="Psychoacoustic model">
                                                            <option value="0">0</option>
                                                            <option value="1">1 (default)</option>
                                                            <option value="2">2</option>
                                                            <option value="3">3</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <hr />
                                            </div>

                                            <h4>Output configuration</h4>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="output_name">Hosts:</label>
                                                <div class="col-sm-2">
                                                    <input type="text" class="form-control" id="add_output_name" value="" placeholder="Description"> 
                                                </div>
                                                
                                                <div class="col-sm-6">
                                                    <div class="input-group">
                                                        <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="Check to enable the output">
                                                            <input type="checkbox" id="add_output_enable" checked="checked">
                                                        </span>
                                                        <select type="select" class="form-control" id="add_output_type">
                                                            <option value="zmq" selected="selected">ZMQ</option>
                                                            <option value="editcp">EDI/tcp</option>
                                                        </select>
                                                        <span class="input-group-addon">/</span>
                                                        <input type="text" class="form-control" id="add_output_host" value="" placeholder="Host or IP">
                                                        <span class="input-group-addon">:</span>
                                                        <input type="text" class="form-control" id="add_output_port"  value="" placeholder="Port">
                                                        
                                                        
                                                        <span class="input-group-btn">
                                                            <button class="btn btn-success" id="btn_output_add" type="button"> <span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div id="output_output">
                                            </div>
                                                
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="output_edi_identifier">EDI identifier:</label>
                                                <div class="col-sm-4">
                                                    <input type="text" class="form-control" id="output_edi_identifier" placeholder="identifier" data-toggle="tooltip" data-placement="top" title="An identifier string that is sent in the ODRv EDI TAG. Max 32 characters length.">
                                                </div>
                                            </div>
                                            
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="output_edi_timestamps_delay">EDI timestamps delay:</label>
                                                <div class="col-sm-4">
                                                    <input type="text" class="form-control" id="output_edi_timestamps_delay" placeholder="delay in ms" data-toggle="tooltip" data-placement="top" title="Timestamps (in ms) in EDI (requires TAI clock bulletin download). If empty this feature is disabled.">
                                                </div>
                                            </div>
                                            
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="output_zmq_key">ZMQ Key:</label>
                                                <div class="col-sm-8">
                                                    <input type="text" class="form-control" id="output_zmq_key" placeholder="Enter ZMQ key if needed" data-toggle="tooltip" data-placement="top" title="Enter ZMQ key if needed">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                            <h4 class="panel-title">
                                            <span class="glyphicon glyphicon-eye-open"></span> <a data-toggle="collapse" data-parent="#accordion" href="#collapsePAD">PAD Encoder</a>
                                            </h4>
                                    </div>
                                    <div id="collapsePAD" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <div class="form-group">
                                            <label class="control-label col-sm-2" for="padenc_enable">Enable:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="padenc_enable">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>

                                                <label class="control-label col-sm-2" for="padenc_pad">pad:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="padenc_pad" placeholder="default: 34" data-toggle="tooltip" data-placement="top" title="PAD length in bytes. Possible values: 6 (short X-PAD), 8 to 196 (variable size X-PAD)">
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_slide_sleeping">Slide sleeping (seconds):</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="padenc_slide_sleeping" placeholder="default: 10" data-toggle="tooltip" data-placement="top" title="Wait DUR seconds between each slide">
                                                </div>

                                                <label class="control-label col-sm-2" for="padenc_slide_once">Remove slide</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="padenc_slide_once">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_dls_file">DLS file:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="padenc_dls_file" placeholder="Enter dls file">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_padenc_dls_file" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>

                                                <label class="control-label col-sm-2" for="padenc_raw_dls">Raw DLS:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="padenc_raw_dls" data-toggle="tooltip" data-placement="top" title="If set to true, do not convert DLS texts to Complete EBU Latin based repertoire character set encoding.">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>
                                            </div>
                                            
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for=""> </label>
                                                <div class="col-sm-3">
                                                </div>
                                                
                                                <label class="control-label col-sm-2" for="padenc_raw_slides">Raw Slides:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="padenc_raw_slides" data-toggle="tooltip" data-placement="top" title="Integrity checks and resizing slides is skipped. Use this if you know what you are doing !">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>
                                            </div>
                                            
                                        {% if is_slide_mgnt is sameas true %}
                                            <hr />
                                            
                                            <h4>Slide management</h4>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_slide_directory">Working slide directory:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="padenc_slide_directory" placeholder="Enter working slide directory">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_padenc_slide_directory" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                                <label class="control-label col-sm-2" for="padenc_slide_carousel_interval">Carousel interval:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="padenc_slide_carousel_interval" placeholder="default 35sec" data-toggle="tooltip" data-placement="top" title="carousel slide interval (default 35sec)">
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_slide_directory_live">Live slide directory:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="padenc_slide_directory_live" placeholder="Enter live slide directory">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_padenc_slide_directory_live" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                                <label class="control-label col-sm-2" for="padenc_slide_live_interval">Live interval:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="padenc_slide_live_interval" placeholder="default 35sec" data-toggle="tooltip" data-placement="top" title="live slide interval (default 35sec)">
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_slide_directory_carousel">Carousel slide directory:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="padenc_slide_directory_carousel" placeholder="Enter carousel slide directory">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_padenc_slide_directory_carousel" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                                <label class="control-label col-sm-2" for="padenc_slide_live_lifetime">Live lifetime:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="padenc_slide_live_lifetime" placeholder="default 300sec" data-toggle="tooltip" data-placement="top" title="live slide lifetime (default 300sec) (Value can not be under live interval)">
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_slide_directory_ads">ADS slide directory:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="padenc_slide_directory_ads" placeholder="Enter ADS slide directory">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_padenc_slide_directory_ads" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        {% else %}
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_slide_directory">Slide directory:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="padenc_slide_directory" placeholder="Enter slide directory">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_padenc_slide_directory" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                        {% endif %}
                                        
                                            <hr />
                                            
                                            <h4>Uniform PAD</h4>
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="padenc_uniform_label_ins">label_ins:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="padenc_uniform_label_ins" placeholder="default: 1200" data-toggle="tooltip" data-placement="top" title="Insert label every DUR milliseconds">
                                                </div>
                                                <label class="control-label col-sm-2" for="padenc_uniform_label">label:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="padenc_uniform_label" placeholder="default:12" data-toggle="tooltip" data-placement="top" title="Wait DUR seconds between each label (if more than one file used)">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                {% if is_adcast is sameas true %}
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                            <h4 class="panel-title">
                                            <span class="glyphicon glyphicon-blackboard"></span> <a data-toggle="collapse" data-parent="#accordion" href="#collapseADCAST">ADCast</a>
                                            </h4>
                                    </div>
                                    <div id="collapseADCAST" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="adcast_enable">Enable:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="adcast_enable">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>
                                                
                                                <label class="control-label col-sm-2" for="adcast_api_url">API URL:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="adcast_api_url" placeholder="https://dig-adcast.appspot.com/" data-toggle="tooltip" data-placement="top" title="ADCast URL">
                                                        <span class="input-group-btn">
                                                            <button type="button" id="btn_adcast_api_test" class="btn btn-info" data-toggle="modal" data-target="#ADCastModal"><span class="glyphicon glyphicon-eye-open"></span> API Test</button>
                                                            

                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="adcast_api_token">API token:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="adcast_api_token" placeholder="" data-toggle="tooltip" data-placement="top" title="Your ADCast API token">
                                                </div>
                                                
                                                <label class="control-label col-sm-2" for="adcast_listen_addr">Listen addr path:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="adcast_listen_addr" placeholder="Enter adcast destination directory">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_adcast_listen_addr" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="adcast_uuid">API UUID:</label>
                                                <div class="col-sm-3">
                                                    <input type="text" class="form-control" id="adcast_uuid" placeholder="" data-toggle="tooltip" data-placement="top" title="Your ADCast UUID">
                                                </div>

                                            </div>
                                            
                                        </div>
                                    </div>
                                </div>
                                {% endif %}
                                
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">
                                        <span class="glyphicon glyphicon-cog"></span> <a data-toggle="collapse" data-parent="#accordion" href="#collapseADVANCED">Advanced</a>
                                        </h4>
                                    </div>
                                    <div id="collapseADVANCED" class="panel-collapse collapse">
                                        <div class="panel-body">

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="coder_autostart">Autostart:</label>
                                                <div class="col-sm-3">
                                                    <select type="select" class="form-control" id="coder_autostart">
                                                        <option value="true">true</option>
                                                        <option value="false">false</option>
                                                    </select>
                                                </div>
                                            </div>
                                        
                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="path_encoder_path">odr-audioenc path:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="path_encoder_path" placeholder="Enter odr-audioenc full path">
                                                        <span class="input-group-addon" id="path_encoder_version">-</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="path_padenc_path">odr-padenc path:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="path_padenc_path" placeholder="Enter odr-audioenc full path">
                                                        <span class="input-group-addon" id="path_padenc_version">-</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="path_sourcecompanion_path">odr-sourcecompanion path:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="path_sourcecompanion_path" placeholder="Enter odr-sourcecompanion full path">
                                                        <span class="input-group-addon" id="path_sourcecompanion_version">-</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="path_zmq_key_tmp_file">zmq tmp file:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="path_zmq_key_tmp_file" placeholder="Enter zmq tmp file path">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_path_zmq_key_tmp_file" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="control-label col-sm-2" for="source_stats_socket">statistics UNIX Datagram socket:</label>
                                                <div class="col-sm-3">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" id="source_stats_socket" placeholder="Enter statistics UNIX Datagram socket">
                                                        <div class="input-group-btn">
                                                            <button class="btn btn-default" type="button" id="btn_reset_source_stats_socket" data-toggle="tooltip" data-placement="top" title="Default value">
                                                                <i class="glyphicon glyphicon-repeat"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>

                                <div>
                                    <a href="#" class="btn btn-info" id="reload" data-toggle="tooltip" data-placement="top" title="Reload configuration from loaded configuration."><span class="glyphicon glyphicon-refresh"></span> Reload configuration</a>
                                    <a href="#" class="btn btn-primary" id="save" data-toggle="tooltip" data-placement="top" title="Write configuration in configuration file."><span class="glyphicon glyphicon-save"></span> Write changes</a>
                                </div>

                            </div>
                        </div>

                        </form>
                    </div>
                </div>
        </div>

</body>

</html>
